<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>

    <script src="${pageContext.request.contextPath}/js/jquery-3.3.1.min.js"></script>

    <script>
        $(function(){
            $("#username").blur(function(){
                var username=$(this).val();


                // $.ajax("请求地址",{});
                // $.ajax({
                //     url:"请求地址",
                // });


                $.ajax({
                    url:"${pageContext.request.contextPath}/validateUsername",
                    data:{"username":username},
                    type:"POST",
                    dataType:"text",
                    headers:{"a":"1"},
                    beforeSend:function(){
                        $("#validateUsernameMessage").html("正在校验...");
                    },
                    success:function(message){
                        $("#validateUsernameMessage").html(message);
                    },
                    error:function(){
                        $("#validateUsernameMessage").html("访问的组件错误");
                    }
                });














                <%--$.get("${pageContext.request.contextPath}/validateUsername?username="+username,--%>
                <%--      function(message){--%>
                <%--          $("#validateUsernameMessage").html(message);--%>
                <%--      });--%>



                <%--$.get("${pageContext.request.contextPath}/validateUsername",--%>
                <%--    "username="+username,--%>
                <%--    function(message){--%>
                <%--        $("#validateUsernameMessage").html(message);--%>
                <%--    });--%>

                <%--$.get("${pageContext.request.contextPath}/validateUsername",--%>
                <%--    {"username":username},--%>
                <%--    function(message){--%>
                <%--        $("#validateUsernameMessage").html(message);--%>
                <%--    });--%>

                <%--$.get("${pageContext.request.contextPath}/validateUsername",--%>
                <%--    $("#f").serialize(),--%>
                <%--    function(message){--%>
                <%--        $("#validateUsernameMessage").html(message);--%>
                <%--    });--%>


                <%--$.post("${pageContext.request.contextPath}/validateUsername",--%>
                <%--    $("#f").serialize(),--%>
                <%--    function(message){--%>
                <%--        $("#validateUsernameMessage").html(message);--%>
                <%--    });--%>

            });

            // $(document).ajaxError(function(){
            //     $("#validateUsernameMessage").html("访问的组件错误");
            // });
            //
            // $(document).ajaxStart(function(){
            //     $("#validateUsernameMessage").html("正在校验...");
            // });

        });
    </script>


</head>
<body>
    <form id="f" action="${pageContext.request.contextPath}/regist" method="post">
      用户名：<input id="username" type="text" name="username"/><span id="validateUsernameMessage"></span><br/>
      密码：<input type="password" name="password"/><br/>
      电话：<input type="text" name="phone"/><br/>
      <input type="submit" value="注册"/>
    </form>

    ${message}
</body>
</html>
